<template>
  <div id="Footer">
    <div class="home">
      <img src="/images/home.png" alt />
      <p>
        <a class="sy" href>首页</a>
      </p>
    </div>
    <div class="sc">
      <img src="/images/book.png" alt />
      <p>
        <a href>手册</a>
      </p>
    </div>
    <div class="bk">
      <img src="/images/blog.png" alt />
      <p>
        <a href>博客</a>
      </p>
    </div>
    <div class="video">
      <img src="/images/video.png" alt />
      <p>
        <a href>视频</a>
      </p>
    </div>
    <div class="wd">
      <img src="/images/my.png" alt />
      <p>
        <a href>我的</a>
      </p>
    </div>
  </div>
</template>

<script >
export default {};
</script>
<style >
#Footer {
  width: 100%;
  height: 1.2rem;
  clear: both;
  background-color: #f0f0f0;
}
body {
  margin: 0;
  padding: 0;
}
#Footer .home {
  width: 0.99rem;
  height: 0.98rem;
  float: left;
  margin-left: 0.5rem;
  margin-top: 0.2rem;
}
#Footer .sc,
.bk,
.video,
.wd {
  width: 0.99rem;
  height: 0.98rem;
  float: left;
  margin-left: 0.5rem;
  margin-top: 0.2rem;
}

#Footer .home img {
  width: 0.48rem;
  height: 0.42rem;
  margin-left: 0.01rem;
  float: left;
}

#Footer .home p {
  font-size: 0.26rem;
  color: #3dd1fd;
  clear: both;
}

#Footer .home p .sy {
  color: #3dd1fd;
}

#Footer .sc p,
.bk p,
.video p,
.wd p {
  font-size: 0.26rem;
  clear: both;
}

#Footer .home p a,
.sc p a,
.bk p a,
.video p a,
.wd p a {
  text-decoration: none;
  color: #999999;
  margin-top: 0.11rem;
}

#Footer .sc img {
  width: 0.34rem;
  height: 0.39rem;
  margin-left: 0.1rem;
  float: left;
}

#Footer .bk img {
  width: 0.39rem;
  height: 0.41rem;
  margin-left: 0.05rem;
  float: left;
}

#app .video img {
  width: 0.47rem;
  height: 0.38rem;
  margin-left: 0.04rem;
  float: left;
}

#Footer .wd img {
  width: 0.43rem;
  height: 0.4rem;
  margin-left: 0.06rem;
  float: left;
}
</style>
